<div ng-controller="DepartCtrl as vm">
    <div class="row">
        <div class="col-md-12">
            <div class="box box-warning">
                <div class="box-header with-border">
                    <h3 class="box-title">Departmental Training & Development Activity</h3>
                    <small class="text-warning">{{vm.msg}}</small>
                    <button ng-disabled="!vm.editable|| vm.loading" class="btn btn-danger btn-xs pull-right" ng-click="vm.saveTable()"><i class="fa fa-check-square-o"></i>Submit</button>
                </div>
                <div class="box-body table-responsive no-padding">
                    <table class="table table-hover">
                        <form class="form-inline">
                            <table class="table table-bordered table-condensed">
                                <tr>
                                    <th></th>
                                    <th># of Planned Activities (MTD)</th>
                                    <th>% of Deliverred (MTD)</th>
                                    <th># of pax</th>
                                    <th>Trainning Hours</th>
                                    <th># of Planned Activities (YTD)</th>
                                    <th>% of Deliverred (YTD)</th>
                                    <th>Reason to Cancell/Postpone</th>
                                </tr>
                                <tr ng-repeat="ret in vm.result">
                                    <td>
                                        <input class="form-control" type="text" ng-disabled="!vm.editable" placeholder="Depart" ng-model="ret.depart"  />
                                    </td>
                                    <td>
                                        <input class="form-control" type="text" ng-disabled="!vm.editable"  ng-model="ret.pmtd" />
                                    </td>
                                    <td>
                                        <input class="form-control" type="text" ng-disabled="!vm.editable"  ng-model="ret.dmtd" />
                                    </td>
                                    <td>
                                        <input class="form-control" type="text" ng-disabled="!vm.editable"  ng-model="ret.pax" />
                                    </td>
                                    <td>
                                        <input class="form-control" type="text" ng-disabled="!vm.editable"  ng-model="ret.hour" />
                                    </td>
                                    <td>
                                        <input class="form-control" type="text" ng-disabled="!vm.editable"  ng-model="ret.pytd" />
                                    </td>
                                    <td>
                                        <input class="form-control" type="text" ng-disabled="!vm.editable"  ng-model="ret.dytd" />
                                    </td>
                                    <td>
                                         <input class="form-control" type="text" ng-disabled="!vm.editable"  ng-model="ret.reason" />
                                    </td>
                                    <td><a ng-if="$index!=0 && vm.editable" ng-click="vm.remove(vm.result, $index)"><i class="fa fa-close"></i></a></td>
                                   
                                </tr>
                                <tr><td><a ng-click="vm.add()"><i class="fa fa-plus"></i></a></td></tr>
                            </table>
                        </form>
                    </table>
                </div>
                <!-- /.box-body -->
            </div>
            <!-- /.box -->
             <div class="box box-danger">
                <div class="box-header with-border">
                    <h3 class="box-title">Departmental Training & Development Review Results (YTD)</h3>
                    <small class="text-warning">{{vm.msg2}}</small>
                    <button ng-disabled="!vm.editable|| vm.loading" class="btn btn-danger btn-xs pull-right" ng-click="vm.saveTable2()"><i class="fa fa-check-square-o"></i>Submit</button>
                </div>
                <div class="box-body table-responsive no-padding">
                    <table class="table table-hover">
                        <form class="form-inline">
                            <table class="table table-bordered table-condensed">
                                <tr>
                                    <th></th>
                                    <th>Jan</th>
                                    <th>Feb</th>
                                    <th>Mar</th>
                                    <th>Apr</th>
                                    <th>May</th>
                                    <th>Jun</th>
                                    <th>Jul</th>
                                    <th>Aug</th>
                                    <th>Sep</th>
                                    <th>Oct</th>
                                    <th>Nov</th>
                                    <th>Dec</th>

                                </tr>
                                <tr ng-repeat="ret in vm.result2">
                                    <td>
                                        <input class="form-control" type="text" ng-disabled="!vm.editable" placeholder="Depart" ng-model="ret.depart" />
                                    </td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td1"/></td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td2"/></td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td3"/></td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td4"/></td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td5"/></td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td6"/></td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td7"/></td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td8"/></td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td9"/></td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td10"/></td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td11"/></td>
                                    <td><input type="text" class="number-input" ng-disabled="!vm.editable" ng-model="ret.td12"/></td>

                                    <td><a ng-if="$index!=0 && vm.editable" ng-click="vm.remove(vm.result2, $index)"><i class="fa fa-close"></i></a></td>
                                   
                                </tr>
                                <tr><td><a ng-click="vm.add2()"><i class="fa fa-plus"></i></a></td></tr>
                            </table>
                        </form>
                    </table>
                </div>
                <!-- /.box-body -->
            </div>
            <!-- /.box -->
        </div>
    </div>
</div>
